import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/Home.vue'

Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home
  },
  {
    path: '/login',
    name: 'Login',
    component: () => import(/* webpackChunkName: "about" */ '../views/Login.vue')
  },
  {
    path: '/register',
    name: 'Register',
    component: () => import(/* webpackChunkName: "about" */ '../views/Register.vue')
  },
  {
    path: '/profile',
    name: 'Profile',
    component: () => import(/* webpackChunkName: "about" */ '../views/Profile.vue')
  },
  {
    path: '/upload1',
    name: 'Upload1',
    component: () => import(/* webpackChunkName: "about" */ '../views/upload/Upload1.vue')
  },
  {
    path: '/upload2',
    name: 'Upload2',
    component: () => import(/* webpackChunkName: "about" */ '../views/upload/Upload2.vue')
  },
  {
    path: '/upload3',
    name: 'Upload3',
    component: () => import(/* webpackChunkName: "about" */ '../views/upload/Upload3.vue')
  },
  {
    path: '/upload4',
    name: 'Upload4',
    component: () => import(/* webpackChunkName: "about" */ '../views/upload/Upload4.vue')
  },
  {
    path: '/message',
    name: 'Message',
    component: () => import(/* webpackChunkName: "about" */ '../views/message/Message.vue')
  },
  {
    path: '*',
    name: '404',
    component: () => import(/* webpackChunkName: "about" */ '../views/NotFound.vue')
  },
  {
    path: '/purchase1',
    name: 'Purchase1',
    component: () => import(/* webpackChunkName: "about" */ '../views/serve/Purchase1.vue')
  },
  {
    path: '/purchase2',
    name: 'Purchase2',
    component: () => import(/* webpackChunkName: "about" */ '../views/serve/Purchase2.vue')
  },
  {
    path: '/purchase3',
    name: 'Purchase3',
    component: () => import(/* webpackChunkName: "about" */ '../views/serve/Purchase3.vue')
  },
  {
    path: '/purchase4',
    name: 'Purchase4',
    component: () => import(/* webpackChunkName: "about" */ '../views/serve/Purchase4.vue')
  },
  {
    path: '/use1',
    name: 'Use1',
    component: () => import(/* webpackChunkName: "about" */ '../views/use/Use1.vue')
  },
  {
    path: '/use2',
    name: 'Use2',
    component: () => import(/* webpackChunkName: "about" */ '../views/use/Use2.vue')
  },
  {
    path: '/reset',
    name: 'Reset',
    component: () => import(/* webpackChunkName: "about" */ '../views/Reset.vue')
  }
]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})
const createRouter = () => new VueRouter({
  scrollBehavior: () => ({ y: 0 }),
  routes: routes
})
export function resetRouter() {
  const newRouter = createRouter()
  router.matcher = newRouter.matcher
}
router.$addRoutes = (params) => {
  const newRouter = createRouter()
  router.matcher = newRouter.matcher
  router.addRoutes(params)
}

// 导航守卫
// 使用 router.beforeEach 注册一个全局前置守卫，判断用户是否登陆
router.beforeEach((to, from, next) => {
  if (to.path === '/login' || to.path === '/register' || to.path === '/' || to.path === '/reset') {
    next();
  } else {
    let token = localStorage.getItem('Authorization');

    if (token === null || token === '') {
      // 用户未登录，跳转到登录页面
      next('/login');
    } else {
      next();
    }
  }
})

export default router
